import React, { Component } from 'react';
import autoBind from 'react-autobind';

import { Checkbox } from 'antd-mobile';
// style
import styles from './index.css';
import IconfontStyle from '../../../assets/iconfont/iconfont.css';

// widget 

class BuyCarFooter extends Component {
	constructor(props) {
        super(props)
        autoBind(this)

    }
    onChangeCheckAll(e) {
    	const { changeCheckAll } = this.props

    	changeCheckAll && changeCheckAll(e.target.checked)
    }
	render() {
		const { checkboxChecked, totalCount, totalPrice, onSubmit } = this.props

	 	return (
	 		<div className={styles['buy-car-footer']}>
	 			 <div className={`${styles["buy-car-footer-item"]} ${styles["buy-car-footer-item-first"]} `} >
	 			 	<Checkbox 
	 			 		onChange={this.onChangeCheckAll}
	 			 		checked={checkboxChecked} ><span style={{marginLeft: '0.12rem', verticalAlign: 'middle', fontSize: '0.32rem', color: '#000'}}>全选</span></Checkbox>
	 			 </div>
	 			 <div className={`${styles["buy-car-footer-item"]} ${styles["buy-car-footer-item-second"]}`}>
	 			 	<span style={{position: 'relative', top: '0.08rem'}}>合计:<span style={{color: 'rgb(255, 0, 82)', fontSize: '0.30rem'}}>￥{totalPrice && parseFloat(totalPrice).toFixed(2)}</span></span>
	 			 </div>
	 			 <div onClick={onSubmit} className={`${styles["buy-car-footer-item"]} ${styles['buy-car-footer-item-third']}`} style={{fontSize: '0.36rem', flex: 3, background: '#FF0052', color: "#fff", textAlign: 'center'}}>
	 			 	去结算({totalCount})
	 			 </div>
	 		</div>
	  	);
	}
};

BuyCarFooter.propTypes = {
};

export default BuyCarFooter
